<div class="bug-list-sidebar-content">
    <!-- Predefined Views -->
    <div class="card">
        <div class="card-header">
            <h4 class="card-title">Predefined Views</h4>
            <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a>
            <div class="heading-elements">
                <ul class="list-inline mb-0">
                    <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                    <li><a data-action="close"><i class="ft-x"></i></a></li>
                </ul>
            </div>
        </div>
        <!-- bug-list search -->
        <div class="card-content">
            <div class="card-body border-top-blue-grey border-top-lighten-5">
                <div class="bug-list-search">
                    <div class="bug-list-search-content">
                        <form action="#">
                            <div class="position-relative">
                                <input type="search" class="form-control" placeholder="Search project bugs...">
                                <div class="form-control-position">
                                    <i class="ft-search text-size-base text-muted"></i>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <!-- /bug-list search -->

            <!-- bug-list view -->
            <div class="card-body ">
                <div class="list-group">
                    <a href="#" class="list-group-item active">All Bugs</a>
                    <a href="#" class="list-group-item list-group-item-action">All Open</a>
                    <a href="#" class="list-group-item list-group-item-action">All Closed</a>
                    <a href="#" class="list-group-item list-group-item-action">My Open</a>
                    <a href="#" class="list-group-item list-group-item-action">My Closed</a>
                    <a href="#" class="list-group-item list-group-item-action">Overdue Bugs</a>
                    <a href="#" class="list-group-item list-group-item-action disabled">Created Today</a>
                    <a href="#" class="list-group-item list-group-item-action">Bugs I Follow</a>
                </div>
            </div>
        </div>
    </div>
    <!--/ Predefined Views -->
    
    <!-- Bug Progress -->
    <div class="card">
        <div class="card-header">
            <h4 class="card-title">Bug Progress</h4>
            <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a>
            <div class="heading-elements">
                <ul class="list-inline mb-0">
                    <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                    <li><a data-action="close"><i class="ft-x"></i></a></li>
                </ul>
            </div>
        </div>
        <div class="card-content">
            <div class="card-body ">
            	<div id="bug-pie-chart" class="height-400 echart-container"></div>
            </div>
        </div>
    </div>
	<!--/ Bug Progress -->
	
	<!-- QA Team -->
    <div class="card">
        <div class="card-header mb-0">
            <h4 class="card-title">QA Team</h4>
            <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a>
            <div class="heading-elements">
                <ul class="list-inline mb-0">
                    <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                    <li><a data-action="close"><i class="ft-x"></i></a></li>
                </ul>
            </div>
        </div>
        <div class="card-content">
            <div class="card-body  py-0 px-0">
                <div class="list-group">
                    <a href="javascript:void(0)" class="list-group-item">
                        <div class="media">
                            <div class="media-left pr-1"><span class="avatar avatar-sm avatar-online rounded-circle"><img src="../../../app-assets/images/portrait/small/avatar-s-1.png" alt="avatar"><i></i></span></div>
                            <div class="media-body">
                                <h6 class="media-heading mb-0">Margaret Govan</h6>
                                <p class="font-small-2 mb-0">QA Analyst</p>
                            </div>
                        </div>
                    </a>
                    <a href="javascript:void(0)" class="list-group-item">
                        <div class="media">
                            <div class="media-left pr-1"><span class="avatar avatar-sm avatar-busy rounded-circle"><img src="../../../app-assets/images/portrait/small/avatar-s-2.png" alt="avatar"><i></i></span></div>
                            <div class="media-body">
                                <h6 class="media-heading mb-0">Bret Lezama</h6>
                                <p class="font-small-2 mb-0">QA Person</p>
                            </div>
                        </div>
                    </a>
                    <a href="javascript:void(0)" class="list-group-item">
                        <div class="media">
                            <div class="media-left pr-1"><span class="avatar avatar-sm avatar-online rounded-circle"><img src="../../../app-assets/images/portrait/small/avatar-s-3.png" alt="avatar"><i></i></span></div>
                            <div class="media-body">
                                <h6 class="media-heading mb-0">Carie Berra</h6>
                                <p class="font-small-2 mb-0">QA Manager</p>
                            </div>
                        </div>
                    </a>
                    <a href="javascript:void(0)" class="list-group-item">
                        <div class="media">
                            <div class="media-left pr-1"><span class="avatar avatar-sm avatar-away rounded-circle"><img src="../../../app-assets/images/portrait/small/avatar-s-6.png" alt="avatar"><i></i></span></div>
                            <div class="media-body">
                                <h6 class="media-heading mb-0">Eric Alsobrook</h6>
                                <p class="font-small-2 mb-0">QA Lead</p>
                            </div>
                        </div>
                    </a>
                    <a href="javascript:void(0)" class="list-group-item">
                        <div class="media">
                            <div class="media-left pr-1"><span class="avatar avatar-sm avatar-away rounded-circle"><img src="../../../app-assets/images/portrait/small/avatar-s-8.png" alt="avatar"><i></i></span></div>
                            <div class="media-body">
                                <h6 class="media-heading mb-0">John Alsobrook</h6>
                                <p class="font-small-2 mb-0">QA Person</p>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!--/ QA Team -->
</div>